<template>
  <div class="service-container">
    <div class="service-header">
      <h2>公共交通服务</h2>
      <p>信用出行，绿色环保</p>
    </div>
    <div class="service-content">
      <!-- 可根据需要添加服务简要介绍或图片 -->
    </div>
  </div>
</template>

<script>
export default {
  name: "PublicTransportation"
}
</script>

<style scoped>
.service-container {
  min-height: 100vh;
  background: radial-gradient(ellipse at center, #001e3c 0%, #000 100%);
  color: #fff;
  padding: 20px;
}

.service-header {
  text-align: center;
  padding: 40px 0;
}

.service-header h2 {
  color: #4fc3f7;
  font-size: 28px;
  margin-bottom: 10px;
}

.service-header p {
  color: #b0bec5;
  font-size: 16px;
}

.service-content {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 400px;
}

.detail-entry {
  text-align: center;
}

.detail-entry i {
  font-size: 60px;
  color: #4fc3f7;
  margin-bottom: 20px;
}

.detail-entry p {
  font-size: 20px;
  color: #fff;
  margin: 10px 0 20px 0;
}
</style>
